{extend name="admin@index_layout"/}
{block name="main"}

<style>
    strong {
        font-size: 20px;
    }

    span {
        font-size: 18px;
    }

    th {
        font-size: 20px;
    }

    td {
        font-size: 18px;
    }

    .layui-row {
        margin: 15px 0;
    }

    .order-detail {
        width: 95vw;
        margin: 20px auto;
        background-color: #fff;
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
        border-radius: 8px;
        overflow: hidden;
    }

    .order-header {
        padding: 20px 20px 0;
        background-color: #f9f9f9;
    }

    .order-header h3 {
        margin: 0;
        font-size: 24px;
        color: #333;
    }

    .order-content {
        padding: 0 20px;
    }

    .order-items table {
        width: 100%;
        border-collapse: collapse;
        margin-top: 20px;
    }

    .order-items th, .order-items td {
        padding: 10px;
        text-align: left;
        border-bottom: 1px solid #ddd;
    }

    .order-status {
        margin-top: 20px;
        padding: 10px;
        background-color: #e6ffe6;
        border-left: 4px solid #5cb85c;
    }

    .order-status span {
        font-size: 16px;
    !important;
        padding: 5px;
    }

</style>

<div class="layui-card order-detail">
    <div class="layui-card-body order-content">
        <div class="layui-elem-quote layui-row layui-col-space10 order-status">
            <div class="layui-col-md3">
                <strong>总佣金:</strong> <span>{$info.actual_commission} 元</span>
            </div>
            <div class="layui-col-md3">
                <strong>平台毛利:</strong> <span>{$info.profit} 元</span>
            </div>
            <div class="layui-col-md3">
                <strong>佣金状态:</strong> <span>{$info.commission_status}</span>
            </div>
        </div>

        <div class="layui-elem-quote layui-row layui-col-space10 order-status">
            <div class="layui-col-md3">
                <strong>直推或自购佣金</strong>
            </div>
            <div class="layui-col-md3">
                <strong>总佣金:</strong> <span>{$info.commission} 元</span>
            </div>
        </div>
        <div class="layui-row layui-col-space10">
            <div class="layui-col-md4">
                <strong>推客佣金佣金:</strong> <span>{$info.share_commission} 元</span>
            </div>
            <div class="layui-col-md4">
                <strong>商品补贴佣金:</strong> <span>{$info.subsidy_commission} 元</span>
            </div>
        </div>

        <div class="layui-elem-quote layui-row layui-col-space10 order-status">
            <strong>推客上级分销佣金:</strong><span>{$info.one_commission} 元</span>
        </div>

        <div class="layui-elem-quote layui-row layui-col-space10 order-status">
            <div class="layui-col-md3">
                <strong>团长佣金</strong>
            </div>
            <div class="layui-col-md3">
                <strong>总佣金:</strong> <span>{$info.total_agent_commission} 元</span>
            </div>
        </div>
        <div class="layui-row layui-col-space10">
            <div class="layui-col-md4">
                <strong>团长实际佣金:</strong> <span>{$info.agent_actual_commission} 元</span>
            </div>
            <div class="layui-col-md4">
                <strong>推客补贴佣金佣金:</strong> <span>{$info.agent_push_commission} 元</span>
            </div>
            {if condition="$info.agent_shop_agent == $info.agent_id"}
            <div class="layui-col-md4">
                <strong>小店补贴佣金佣金:</strong> <span>{$info.agent_shop_commission} 元</span>
            </div>
            {/if}
        </div>

        {if condition="$agent"}
        <div class="layui-elem-quote layui-row layui-col-space10 order-status">
            <strong>小店所属团长补贴佣金</strong>
        </div>
        <div class="layui-row layui-col-space10">
            <div class="layui-col-md4">
                <strong>团长名称:</strong> <span>{$agent}</span>
            </div>
            <div class="layui-col-md4">
                <strong>小店补贴佣金佣金:</strong> <span>{$info.agent_shop_commission} 元</span>
            </div>
        </div>
        {/if}

    </div>
</div>

{/block}
